<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        *{margin: 0;padding: 0;
        }
         .header{
        width:100%; height:160px;
         background-color: #4caf50;
         text-align: center;
         font-family: Arial, Helvetica, sans-serif;
       position: fixed;top:0;
    }  
    nav{background-color: #333;height: 45px;margin-top: 160px;
    }
    nav ul{
        display:flex;
        justify-content: center;
        list-style: none;
    }
    nav ul li{margin: 0 20px;}
    nav ul li a{
        color:aliceblue;
        text-decoration: none;
        font-size: 1.1em;
        padding: 5px 10px;
        border-radius: 4px;
    }
    .one{
        width:1200px;height:160px;
        background-color: #f5f5f5;
        font-family: Arial, Helvetica, sans-serif;
        margin-left: 150px;margin-top: 20px;
    }
    .x{
        text-indent: 2em;
    }
    .two{
        width:1200px;height:380px;
        background-color: #f5f5f5;
        font-family: Arial, Helvetica, sans-serif;
        margin-left: 150px;margin-top: 2px;
      
    }
    .s{margin-left: 180px; margin-top: -100px;}
.c{
    margin-left: 180px;margin-top: -100px;
}
.n{margin-left: 180px; }
.three{
        width:1200px;height:330px;
        background-color: #f5f5f5;
        font-family: Arial, Helvetica, sans-serif;
        margin-left: 150px;margin-top: 20px;
    }
    .four{ width:1200px;height:170px;
        background-color: #f5f5f5;
        font-family: Arial, Helvetica, sans-serif;
        margin-left: 150px;margin-top: 20px;margin-bottom: 150px;
    }
        .five{width: 100%;
        height: 140px;
        overflow: hidden;
        background-color:#4caf50;
        color: black;
        margin-top: 50px;
        text-align: center;position: fixed;bottom: 0;
    }
    .a{text-indent: 2em;}
    </style>
</head>
<body>
    <div class="header">
<h1 style="color: #f5f5f5;">职业教育编程大赛</h1>
<h2 style="color:#f5f5f5 ;">软件web方向班</h2>
<h2 style="color: #f5f5f5;">2025年5月7日</h2>
</div>
    <nav>
        <ul>
            <li><a href="">竞赛介绍</a></li>
            <li><a href="">参赛选手</a></li>
            <li><a href="">竞赛规则</a></li>
            <li><a href="">成绩展示</a></li>
        </ul>
    </nav>
    
    <div class="one">
<h2 style="color: #4caf50;">竞赛介绍</h2><hr>
<p class="x">为企业、高校和科研机构发掘具有优秀 Web 编程能力的人才。通过竞赛的形式，能够从众多参赛者中筛选出在 Web 开发领域具有天赋和潜力的人，为相关领域的发展提供人才储备。</p>
<p class="x">是国内具有较高影响力的编程竞赛之一。Web 方向主要考察前端开发和后端服务能力。</p>
<p class="x">4 小时限时编程，题型包含页面布局、数据交互、API 开发等</p>
<p class="x">大赛由高校、企业、行业协会联合举办，整合各方资源，为参赛者提供学习、交流与展示的平台，同时推动技术成果转化与产学研合作。</p>
    </div>
    <div class="two">
        <h2 style="color: #4caf50;">参赛选手</h2><hr>
        <img src="../day2/imge/OIP-C (4).jpg" width="290px"height="270px;">
        <img  src="../day2/imge/OIP-C (5).jpg"width="290px"height="270px;" >
        <img src="../day2/imge/0cd6cd18b3132f96c735e0862872d428.jpg" width="300px"height="270px;">
        <img src="../day2/imge/1695193245716930.png"  width="300px"height="270px;">
        <span>张三</span>
        <span style="margin-left: 290px;">李四</span>
        <span style="margin:240px;">王五</span>
        <span style="margin: 100px;">赵六</span>
        <span style="margin: 68.218px;">掌握HTML5、CSS3等前端技术</span>
        <span style="margin: 60px;">专注于 Web 前端开发方向。</span>
        <span>自学了 React.js 和 TypeScript 语言</span>
        <span style="margin: 40px;">团队中不可或缺的一员。</span>
        </div>
        <div class="three">
            <h2 style="color: #4caf50;">竞赛规则</h2><hr>
         <h4>参赛资格</h4>
         <p class="a">参赛对象：明确规定参赛的人员范围，如全日制在校学生（包括不同学历层次，如本科、专科等）、在职人员，或者特定行业、特定地区的人员等。例如，某大赛规定参赛对象为全国各高校在校大学生。</p>
         <h4>竞赛赛程</h4>
         <p class="a">比赛阶段：分为初赛、复赛、决赛等阶段，分别说明每个阶段的时间安排、比赛形式和要求。例如，初赛为线上提交作品，时间为 [具体时长 1]；决赛为线下现场答辩和展示，时间为 [具体时长 2]。</p>
         <h4>答案提交与评测</h4>
         <p class="a">提交方式：指定提交答案的方式，如通过在线平台提交代码文件、压缩包，或者提交已部署好的项目链接等。同时，说明提交的截止时间，超过时间提交将无效。</p>
         <p class="a">评测方式：说明如何对参赛作品进行评测，如采用自动化测试工具进行功能测试、性能测试，或者由评委人工评审代码质量、界面设计等方面。明确评分的标准和权重，如功能实现占 60%、代码质量占 30%、界面设计占 10%。</p>
        <h4>奖项设置</h4>
        <p class="a">奖项种类：设立一等奖、二等奖、三等奖等常规奖项，也可能设置优秀奖、最佳创意奖、最佳技术奖等特色奖项。</p>
        </div>
        <div class="four">
<h2 style="color: #4caf50;">成绩展示</h2><hr>
        
        <table>
            <tr>
                <span style="margin-left:30px ;" >参赛编号</span>
                <span style="margin-left: 30px;">姓名</span>
                <span style="margin: 30px;">初赛得分（满分 100）</span>
                <span style="margin: 25px;">复赛得分（满分 100）</span>
                <span style="margin: 25px;">决赛得分（满分 100）</span>
                <span style="margin: 20px;">综合得分（满分 100）</span>
                <span style="margin: 30px;">最终排名</span><hr>
            </tr>
            <tr>
                <span style="margin-left: 55px;">001</span>
                <span style="margin-left: 30px;">张三</span>
                <span style="margin-left: 55px;">85</span>
                <span style="margin-left: 195px;">88</span>
                <span style="margin-left: 180px;">90</span>
                <span style="margin-left: 185px;">87.4</span>
                <span style="margin-left: 205px;">1</span>
            <hr>
            <div>
            <span style="margin-left: 50px;">002</span>
                <span style="margin-left: 30px;">李四</span>
                <span style="margin-left: 50px;">82</span>
                <span style="margin-left: 190px;">88</span>
                <span style="margin-left: 180px;">84</span>
                <span style="margin-left: 180px;">84.6</span>
                <span style="margin-left: 200px;">2</span>
                </div>
            <hr>
            <div>
                <span style="margin-left: 50px;">003</span>
                <span style="margin-left: 30px;">王五</span>
                <span style="margin-left: 50px;">82</span>
                <span style="margin-left: 190px;">87</span>
                <span style="margin-left: 180px;">76</span>
                <span style="margin-left: 180px;">82.6</span>
                <span style="margin-left: 200px;">3</span>
            </div>
            <hr>
            <div>
                <span style="margin-left: 50px;">004</span>
                <span style="margin-left: 30px;">赵六</span>
                <span style="margin-left: 50px;">82</span>
                <span style="margin-left: 190px;">70</span>
                <span style="margin-left: 180px;">76</span>
                <span style="margin-left: 180px;">80.6</span>
                <span style="margin-left: 200px;">4</span>
            </div>
            <hr>
        </table>
        </div>
        <div class="five">
  <h2 style="color: #f5f5f5;">
   班级口号： 键盘如鼓，代码似歌。web 战队，赛出自我！
  </h2>
  <h2 style="color: #f5f5f5;">
   制作人： 软件web方向班王琢引
  </h2>
        </div>
</body>
</html>